@extends('layouts.admin')
@section('style')
@endsection
@section('content')
    <div class="admin_main">
        <div class="admin_header_fixed">
            <div class="admin_header clearfix">
                <div class="title"><i></i>操作员列表</div>
                <div class="action">
                    <b></b>
                    <div class="layui-btn-group ">
                        <a class="layui-btn layui-btn-primary layui-btn-small create" data-title="新增操作员" data-icon="fa-plus-circle" href="{{ url('user/create') }}"><i class="fa fa-plus-circle"></i> 新增</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="admin_base">
            <div class="admin_module clearfix admin_module_search">
                <i class="line"></i>
                <a class="javascript" id="list_search_toggle" data-search-box="list_search" rel='list_search_switch'>关闭搜索</a>
                <div id="list_search" class="clearfix" >
                    <form  action="{{ url('user') }}"  id="UserForm"   class="layui-form layui-form-pane" novalidate="1">
                       <div clss="layui-inline">
                            <div class="layui-form-item">
                                <div class="layui-input-inlinen">
                                    <select name="opt_type" style="width:auto">
                                        <option value="mobile" @if($opt_type=='mobile') selected @endif >手机号码</option>
                                        <option value="nickname" @if($opt_type=='nickname') selected @endif >用户名</option>
                                        <option value="email" @if($opt_type=='email') selected @endif>邮箱地址</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-inline">
                                    <input type="text" name="keywords" value="{{ $keywords }}" id="keywords" placeholder="请填写关键词"  class="layui-input">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-inline">
                                    <select name="status" id="status"   class="form_item" lay-search="" lay-filter="status">
                                        <option value="">≡请选择状态≡</option>
                                        <option value="1" @if($status==1) selected @endif >正常</option>
                                        <option value="0" @if($status!='' && $status==0) selected @endif>已禁用</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-input-inline">
                                    <button class="layui-btn" lay-submit lay-filter="btn_query" >查询</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            <div class="box_list">
                <div class="box_content">
                    <form method="post" action=""  id="list_form"   class="layui-form" novalidate="1">
                        {{ csrf_field() }}
                        <table class="layui-table list" lay-skin="row" lay-even="true" lay-filter="list">
                            <colgroup>
                                <col width="59"/>
                            </colgroup>
                            <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>用户名</th>
                                    <th>手机号</th>
                                    <th>电子邮箱</th>
                                    <th>状态</th>
                                    <th class="item_action">操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($datas as $vo)
                                    <tr>
                                        <td>{{ $vo->id }}</td>
                                        <td>{{ $vo->nickname }}</td>
                                        <td>{{ $vo->mobile }}</td>
                                        <td>{{ $vo->email }}</td>
                                        <td>
                                            <input type="checkbox" lay-filter="switchStatus" lay-skin="switch" data-id="{{ $vo->id }}" data-url="{{ url('user/status') }}" lay-text="正常|禁用" value="{{ $vo->status }}" @if($vo->status == 1) checked @endif />
                                        </td>
                                        <td class="item_action">
                                            <div class="layui-table-cell">
                                                @if($vo->is_sys==0)
                                                    <a class="layui-btn layui-btn-xs layui-btn-default javascript" rel="modifyPassword" href="{{ url('user/password?id='.$vo->id) }}" >改密</a>
                                                    <a class="layui-btn layui-btn-xs layui-btn-primary" href="{{ url('user/'.$vo->id.'/edit') }}">编辑</a>
                                                    <a class="layui-btn layui-btn-xs layui-btn-warm javascript" rel="setRole" href="{{ url('user/role/'.$vo->id) }}">设置角色</a>
                                                    <a class="layui-btn layui-btn-xs layui-btn-danger J-item-delete" data-id="{{ $vo->id }}" href="{{ url('user/'.$vo->id) }}">删除</a>
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </form>
                </div>
                <div class="page-box">
                    <div id="pageShow"></div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script type="text/javascript">
        var layForm;
        var count =parseInt("{{ $counts }}");
        var limit =parseInt("{{ $limit }}");
        var currPage =parseInt("{{ $page }}");
        var modifyPassword= null;
        var setRole = null;
        layui.use(['form','element','layer','utils','xmPage'], function(){
            layForm = layui.form;
            var URL = layui.utils.URL;
            var layer = layui.layer;
            var xmPage = layui.xmPage({
                formElem:'#UserForm',
                limit:limit,
                count:count,
                curr:currPage,
                layout:['prev','page','next','skip','count','limit'],
                prev:'<i class="fa fa-arrow-left"></i>',
                next:'<i class="fa fa-arrow-right"></i>',
            });
            xmPage.render();

             setRole = function() {
                var url = $(this).attr('href');
                var current_document = document;
                if(parent.layer){
                    var Layer = parent.layer;
                }else{
                    var Layer = layer;
                }
                Layer.open({
                    type: 2,
                    title: '设置角色',
                    content: url,
                    resize: false,
                    area: ['600px', '500px'],
                    btn: ['确定', '取消'],
                    yes: function (index, layero) {
                        var contentWindow = $(layero).find('iframe')[0].contentWindow;
                        var document = contentWindow.document;
                        contentWindow.doSubmit(function () {
                            Layer.closeAll();
                        });
                    }
                })
            }
            layForm.on('submit(btn_query)',function(data){
                $("#page").val(1);
                $(data.form).submit();
            })
            layForm.on('switch(switchStatus)', function(data){
                var $this=$(data.elem);
                var $switch = $(data.othis);
                var url=$this.data('url');
                var value=$this.val();
                var id = $this.data('id');
                var data = {id:id,value:value};
                parent.layer.confirm('请确认是否执行该操作？',function(){
                    parent.layer.closeAll();
                    URL.post(url,data,{
                        success:function(res){
                            if(res.code==1){
                                layer.msg('操作成功',{icon:6,times:2000},function(){
                                    $this.val(res.data.value);
                                })
                            }else{
                                layer.msg(res.message,{icon:5,times:3000},function(){
                                    switch_status_fail($this,$switch);
                                })
                            }
                        }
                    })
                },function(){
                    switch_status_fail($this,$switch);
                })
            });
            var switch_status_fail = function($this,$switch){
                $this.prop('checked',!$this.prop('checked'));
                var text = $switch.find('em').text() =='正常' ? '禁用':'正常';
                $switch.toggleClass('layui-form-onswitch').find('em').text(text);
            }
        });
    </script>
@endsection